<template>
		<div>
			<div>
				<my-header :title="'选择收货地址'" :hasTitle="true" :hasBack="true">
					<slot name="zx">
		        		<div id="add_address" style="padding-right: 0.8rem;" class="aui-pull-right text-del" @click.stop="onSub">保存</div>
		        	</slot>
				</my-header>
			</div>
			<div style="text-align: left;">
				<ul class="aui-list aui-form-list aui-margin-b-15">
					<li class="aui-list-item">
		            	<div class="aui-list-item-inner" @click="goTomap">
		                    <div class="aui-list-item-label">选择地区</div>
		                    <div class="aui-list-item-input aui-list-item-arrow">
		                        <div id="name" class="addressText" style="width: 98%;color: #757575;"> {{'addressDetail?addressDetail:如：北京市 市辖区 昭阳区'}} </div>
		                    </div>
		                </div>
		            </li>
					<li class="aui-list-item menpai">
						<div class="aui-list-item-inner">
							<div class="aui-list-item-label">详细地址</div>
							<div class="aui-list-item-input" style="text-align: left;">
								<p placeholder="如：圣城街道怡景小区5栋402" id="detail-address" >{{'address'}}</p>
							</div>
						</div>
					</li>
				</ul>
				
				<ul class="aui-list aui-form-list aui-margin-b-15">
					<li class="aui-list-item">
						<div class="aui-list-item-inner">
							<div class="aui-list-item-label">姓名 </div>
							<div class="aui-list-item-input">				<!--receivername-->
								<input type="text" placeholder="输入收货人姓名" v-model="receivername" id="receivername">
							</div>
						</div>
					</li>
					<li class="aui-list-item">
						<div class="aui-list-item-inner">
							<div class="aui-list-item-label">性别</div>
							<div class="aui-list-item-input addressText" id="Sex">
								<label><input class="aui-radio" type="radio" name="demo1" :checked="sex=='男'" @click.stop="getSex(0)"><span class="labelMargin">先生</span></label> &nbsp;&nbsp;
								<label><input class="aui-radio" type="radio" name="demo1" :checked="sex=='女'" @click.stop="getSex(1)"><span class="labelMargin">女士</span></label>
							</div>
						</div>
					</li>
					<li class="aui-list-item">
						<div class="aui-list-item-inner">
							<div class="aui-list-item-label">手机号码</div>
							<div class="aui-list-item-input">
								<input type="text" placeholder="输入收货人手机号码" v-model="phone" id="mobile">
							</div>
						</div>
					</li>
				</ul>
				
				<ul class="aui-list aui-form-list aui-margin-b-15" >
					<li class="aui-list-item">
						<div class="aui-list-item-inner">
							<div class="aui-list-item-label">标签</div>
							<!-- <div class="aui-list-item-input aui-list-item-arrow">
								<p id="label">选择"家、公司"标签</p>
							</div> -->
							<div style="width: 100%" class="address-tab-box addressText">
								<label><input class="aui-radio" type="radio" name="address-tab" :checked="label=='家庭'" @click.stop="getLabel(0)"><span class="labelMargin">家庭</span></label>&nbsp;&nbsp;
								<label><input class="aui-radio" type="radio" name="address-tab" :checked="label=='公司'" @click.stop="getLabel(1)"><span class="labelMargin">公司</span></label>&nbsp;&nbsp;
								<label><input class="aui-radio" type="radio" name="address-tab" :checked="label=='其他'" @click.stop="getLabel(2)"><span class="labelMargin">其他</span></label>
							</div>
						</div>
					</li>
					<li class="aui-list-item">
						<div class="aui-list-item-inner">
							<label><input class="aui-checkbox" type="checkbox" name="demo1" ref='checkedBo' id="defaultAddress" :checked="defaultaddress=='默认'" @click.stop="setDefault">&nbsp;设为默认地址</label>
						</div>
					</li>
				</ul>
			</div>
		</div>
</template>

<script>
	import { mapMutations, mapGetters } from 'vuex';
	import axios from 'axios';
	import MyHeader from "../header";
	import {Toast} from '../../utils/toast';
	//	import { Popup } from 'mint-ui';
	export default {
		props: {
			
		},
		components: {
			"my-header": MyHeader,
		},
		computed: {
			...mapGetters('zx', [
				"getHomeAddressNow",'getHomeStoreNow'
			]),
			...mapGetters('wxh', [
		        "login",
		        'userInfo',
		        'sessionId'
		    ]),
		},
		watch: {
			
		},
		data() {
			return {
				province:null,
				city:null,
				region:null,
				addressDetail:null, 
				result:null,
				label:null,
				receivername:null,
				sex:null,
				phone:null,
				defaultaddress:null,
			}
		},
		mounted(){
			
		},
		created() {
		
		},
		beforeDestroy() {
			
	    },
		methods: {
			...mapMutations('zx',[
				
			]),
			goTomap(){
//				this.$router.push({path:'map',query:{type:'add',id:1}});
				this.$router.push({
					path:'map',
					query:{type:'edit',positionlng:positionlng,positionlat:positionlat,addressDetail:this.addressDetail}
				});
			},
			getLabel(num){
				if(num == 0){
					this.label = '家庭';
				}else if(num == 1){
					this.label = '公司';
				}else if(num == 2){
					this.label = '其他';
				}
			},
			getSex(type){
				if(type == 0){
					this.sex = '男';
				}else {
					this.sex = '女';
				}
			},
			setDefault(){
				if(this.$refs.checkedBo.checked){
					this.defaultaddress = '默认';
				}else{
					this.defaultaddress = '非默认';
				}
			},
			showMessage(msg) {
	            Toast({
	                message: msg,
	                duration: 1000,
	                type:'fail'
	            });
	        },
	          addAddressQuicker(obj){
	        	if(obj){
	        		var provinceId = null;
//	        		let url = window.api.mall_base_host + '/address/getarealist?areaid=' + 1   erp接口
					var url = window.api.base_host+'/address/select/'
//	        		http://172.19.5.89:33001/address/select/1 
			        axios.get(url + 1).then((res)=>{
			      
			        	var province = res.data.data;
			        	for(let i = 0; i < province.length; i++){
			        		
			        		if(obj.province == province[i].name){
			        			console.log(province[i].id,'province[i].name')
			        			this.province = province[i].rid;
			        			axios.get(url + province[i].rid).then((res)=>{
			        				var city = res.data.data;
			        				for(let j = 0; j < city.length; j++){
			        					if(obj.city === city[j].name){
			        						console.log(city[j].rid,'city[j].name');
			        						this.city = city[j].rid;
			        						axios.get(url + city[j].rid).then((res)=>{
			        							var region = res.data.data;
			        							for(let k = 0 ;k < region.length; k++){
			        								if(obj.region === region[k].name){
			        									this.region = region[k].rid;
			        								}
			        							}
			        						})
			        					}
			        				}
			        			})
			        		}
			        	}
			        })
	        	}
	        },
			onSub(){
				var params = {};
				
				console.log(this.label);
				console.log(this.receivername);
				console.log(this.sex);
				console.log(this.phone);
				console.log(this.defaultaddress);
				
				return ;
				params = this.$store.getters['zx/getNowAddress'];
				console.log(params,'params*********************************')
				if(!params.province || !params.city || !params.region ) {
	                this.showMessage('请选择地区')
	                return
	            }
	            if(!params.address) {
	                this.showMessage('请填写详细地址')
	                return
	            }
	            if(!params.receivername) {
	                this.showMessage('请填写收货人姓名')
	                return
	            }
	            if(!params.phone) {
	                this.showMessage('请填写联系号码')
	                return
	            } else {
	                let reg = new RegExp(/^0?(13[0-9]|15[012356789]|17[013678]|18[0-9]|14[57])[0-9]{8}$/)
	                if(!reg.test(parseInt(params.phone))){
	                    this.showMessage('请填写正确的手机号')
	                    return
	                }
	            }
	            if(!params.label) {
	                this.showMessage('请选择地址标签')
	                return
	            }
				
				if(this.addFlag){
//					console.log("+-+-你的世界的嗡嗡嗡嗡嗡的我的地位-+-+",params);
					params.type = 'ADD';
					this.setAddressInfo(params);
					let id = this.$route.query.id;
					if(id){
						this.$router.push({path:'address',query:{id:2}});
					}else{
						this.$router.push('address');
					}
//					this.$router.push('address');
				}else{
					params.type = 'UPDATE';
					params.showToast = true;
//					console.log("+-+-+-你的世界哦批評加哦加哦解開了解開了看見了空間經理儘快瞭解+--++-+--+-+");
					this.setAddressInfo(params);
//					this.$router.push('address');
					let id = this.$route.query.id;
					if(id){
						this.$router.push({path:'address',query:{id:2}});
					}else{
						this.$router.push('address');
					}
				}
				
			}
		},

	}
</script>

<style scoped="scoped">
	.labelMargin{
		margin-left: 6px;
	}
</style>